
<script>
import { chessboard }  from 'vue-chessboard'
import emitvue from "@/lib/emitvue";

export default {
  name: 'editor',
  extends: chessboard,
  data() {
    return {
      currentFen: null,
    }
  },
  methods: {
    afterMove() {
      return (orig, dest) => {
        if (this.isPromotion(orig, dest)) {
          this.promoteTo = this.onPromotion()
        }
        this.game.move({from: orig, to: dest, promotion: this.promoteTo}) // promote to queen for simplicity
        // this.board.set({
        //   fen: this.game.fen()
        // })
        this.calculatePromotions()
        this.currentFen = this.board.getFen()
        emitvue.$emit("editMove", this.currentFen)
      };
    }
  },
  mounted() {
    this.board.set({
      movable: {
        color: 'both',
        free: true,
        events: { after: this.afterMove()}
      }
    })
    console.log("this.board", this.board)
    // 外部设置编辑器的fen
    emitvue.$on("setFen", (data) => {

    })
  },
  watch: {
    fen() {
      console.log("this.board", this.board)
    }
  }
}
</script>
